<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>wootQuery</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="index.css" media="screen" title="Default" />
    <script type="text/javascript" src="wootquery.js"></script>
    <script type="text/javascript" src="input.js"></script>
  </head>
  <body>
    <h1 id="sup" class="asdf">Welcome to the Show</h1>
    <div id="woot" class="asdf">Hello, everybody!</div>
    <i>wewties</i>
    <p>Fine weather we're having, </p>
    <ul>
      <li><a href="#" onClick="javascript:$().capture();">Click me!</a></li>
      <li id="ownage"><a href="#" id="pwnage" onClick="javascript:this.innerHTML = $(woot).html();">Modify by Element!</a></li>
      <li><a href="#" onClick="javascript:this.innerHTML = $('#woot').html();">Modify by ID!</a></li>
      <li><a href="#" onClick="javascript:$(woot).append(' <b>I be appended!</b>');">Modify #woot!</a></li>
      <li><a href="#" onClick="javascript:$('li').append(' <b>List element!</b>');">Modify list items</a></li>
      <li><a href="#" onClick="javascript:$('.asdf').append(' <b>Wooties!</b>');">Wooties!</a></li>
      <li><a href="#" onClick="javascript:$('ul b').append('!');">Ancestor selector (bold get +!)</a></li>
      <li><a href="#" onClick="javascript:$('ul > li').append('!');">Child selector (list elements get +!)</a></li>
    </ul>
    <div id="clone"></div>
    <script type="text/javascript">
      var woot = document.getElementById("woot");
      $('#woot').addClass("sup yo");
      //alert($('#woot').hasClass("sup"));
      /**
        $('#woot').removeClass();      
        alert($('#woot').html());
        $('#woot').setHtml("waddup");
        alert($('#woot').html());      
      **/
      //$('#woot').after("<p><i><b>sup</b></i></p>");          
      //$('#woot').before("<b>sup</b>");
      //$('#woot').wrap("<b></b>");
      //$('#woot').wrap(document.createElement("b"));
      //$('#woot').wrapInner(document.createElement("b"));
      //$('#woot').wrapInner("<b></b>");      
      //$('#woot').wrapInner(document.createElement("b")).wrap("<i></i>");     
      //alert($('#woot').replaceWith("<b>hi</b>").html());    
         //var test = document.createElement("b");
         //test.innerHTML = "woot";
         //$('#woot').replaceWith(test);  
      //$('#woot').empty().append("sup");  
      //$('#woot').remove();
      //$('#sup').append($('#woot').remove().html());
         //$('#woot').removeAttr("class");
         //alert($('#woot').attr("class"));
      //$('#sup').prepend($('i').clone());  
          //var test = document.createElement("u");
          //test.innerHTML = "woot";
          //$('#sup').prepend(test);
      //$('#sup').append('<i>WADDUP</i>');   
      //alert($('li').eq(2).html());
      //$('#woot').add('#sup').append("<i>double-kill!</i>");
      //$('li').slice(1).append("BOOOOYYAAAHHH");
      //$('li').slice(1,5).append("BOOOOYYAAAHHH");
      //$('a').not("#pwnage").append("YEAH!");
      //$('li').filter('#ownage').append("WORKS!");
      /**
                 $('li').filter(function(element){
                    if(element.getAttribute("id")){
                        return true;
                    } else {
                        return false;
                    }
                  }).append("WORKS!");
             **/
      //alert($('li').size());
      //alert($('li').get(3).innerHTML);
      //alert($('li').selector);
      //alert($('ul').selector);
      //alert($('li').is('#ownage'));
      //alert($('li').is('#pew'));    
      //$('li').parent().append("MEOW!");
      //$('li:first').parent().append("MEOW!");
      //$('ul').children().append("PWNT!")
      //$('li').eq(5).next().append("WOOT!").next().append("2ND WOOT!").next().append("3RD WOOT");
      //$('li:first').next().append("WOOT!");
      //$('li:first').next().prev().append("WOOT!");
      //$('li:last').prev().append("WOOT!").prev().append("WOOT!");
      //$('li').siblings().append("YEEHAW!");
      //$('li:first').siblings().append("YEEHAW!");
      
    </script>
  </body>
</html>